<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>捐赠</title>
  <link rel="stylesheet" href="css/donate.css">
</head>
<body>
  <div class="container">
    <h1>支持我们</h1>
    <div>作者笔名：圣小开，自由职业者（2024-12 至今）</div>
    <p>请选择一种支付方式进行捐赠：</p>

    <!-- Tab 导航 -->
    <div class="tabs">
      <button class="tab-link" data-tab="alipay">支付宝</button>
      <button class="tab-link active" data-tab="wechat-official">【推荐】通过文章打赏</button>
      <button class="tab-link" data-tab="wechat">微信支付</button>
    </div>

    <!-- Tab 内容 -->
    <div id="alipay" class="tab-content">
      <h2>支付宝捐赠</h2>
      <p>请使用支付宝扫描以下二维码进行捐赠：</p>
      <img src="images/alipay.png" alt="支付宝二维码" class="qr-code">
      <p align="center"><a href="https://blog.umu618.com/images/alipay.png" target="_blank">备用支付宝二维码</a></p>
    </div>

    <div id="wechat-official" class="tab-content active">
      <h2>通过微信公众号文章打赏</h2>
      <p>请给以下文章打赏：</p>
      <ul>
        <li>文章：<a href="https://mp.weixin.qq.com/s/zyxo-y4RGq4UEXbiQH4m8Q">声音共享 SoundShare</a></li>
      </ul>
      <p>请使用微信扫描以下二维码关注公众号（UMU618）：</p>
      <img src="images/wechat-official-account-qrcode.jpg" alt="微信公众号二维码" class="qr-code">
      <p align="center"><a href="https://blog.umu618.com/images/wechat-official-account-qrcode.jpg" target="_blank">备用微信公众号二维码</a></p>
    </div>

    <div id="wechat" class="tab-content">
      <h2>微信支付捐赠</h2>
      <p>请使用微信扫描以下二维码进行捐赠：</p>
      <img src="images/UMU618-wechat.jpg" alt="微信二维码" class="qr-code">
      <p align="center"><a href="https://blog.umu618.com/images/UMU618.jpg" target="_blank">备用微信二维码</a></p>
    </div>
  </div>
  <script src="js/donate.js"></script>
</body>
</html>
